@each $color in $outline-colors {
    .#{$pretty--class-name}.#{nth($color,1)} {
        input:checked+ label i {
            &:before {
                color: #fff;
                background-color: nth($color, 3) !important
            }

            &:after {
                border-color: nth($color, 3);
                background-color: nth($color, 3) !important
            }
        }

        input[type='radio']:checked+ label i.default {
            &:before {
                background-color: nth($color, 3) !important;
                color: transparent;
            }

            &:after {
                background-color: initial !important;
                border-color: nth($color, 3);
            }
        }

        &.smooth {
            input:checked ~ label i:after {
                transform:scale(1) !important;
            }
        }
    }

    .#{$pretty--class-name}.#{nth($color,2)} {
        input:checked+label i {
            &:before {
                color: nth($color, 3);
            }

            &:after {
                border-color: nth($color, 3);
            }
        }
    }

    .#{$pretty--class-name}.toggle {
        @each $subcolor in $outline-colors {
            i.#{nth($subcolor,1)} {
                &:before {
                    color: nth($subcolor, 3) !important;
                }
            }
        }
    }
}
